<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="s" uri="/struts-tags" %>

<script type="text/javascript" language="javascript"
        src="<%=request.getContextPath()%>/js/main/forTab.js"></script>

<link type='text/css' href='<%=request.getContextPath()%>/css/general/changePassword.css' rel='stylesheet'
      media='screen'/>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/main/changePassword.js"></script>
<style type="text/css">

    #deviceInfo {
        margin-right: 0px;
        margin-top: 0px;
        float: right;
        padding-right: 0px !important;
        padding-top:0px;
    }

    #allUsers {
        margin-top: 70px;
    }

    .networks {
        margin-right: 15px;
        width: 32px;
        height: 32px;
        float: right;
    }

</style>

<script type="text/javascript">
    $(document).ready(function() {
        //for chrome
        $(".networks").css("float", "right");
        $(".networks").css("margin-right", "15px");

        $("#changingPassword").hide();
        var obj = $(".subUser");
        $.ajax({
            url:'adminUsersView.action',
            type:'POST',
            success:function(result) {
                $("#allNetworks").attr("src", 'images/users/users1.png');
                $(".subUser").html(result);
                var networkHeightInt = parseFloat($("#allUsers").css("height").split("p")[0]);
                var contentHeightInt = parseFloat($("#content").css("height").split("p")[0]);
                $("#content").css("height", contentHeightInt > networkHeightInt ? contentHeightInt : networkHeightInt);
                contentHeightInt = parseFloat($("#content").css("height").split("p")[0]);
                contentHeightInt > 600 ? $("#deviceInfo").find("img").css("margin-top", "15%") : $("#deviceInfo").find("img").css("margin-top", "0%");
            }
        });
        var firstNetwork = $(".subUser").html();

    })

</script>

<div id="grayBox"></div>
<%--Changing profile dialog start--%>
<div id="changeProfile">
    <div id="close">

        <a href="#" class="closeWindow">
            <img src="<%=request.getContextPath()%>/images/close/close.png" width="24" height="24"/>
        </a>
    </div>

    <h3> Editing Profile </h3>

    <div id="changingOthers">

        <div class="label">
            Username:<span id="validtoChangeUsername"></span>
            <input type="text" value="<s:property value="#session.user.username" />" class="toChangeUsername"/>

        </div>
        <input type="hidden" value="<s:property value="#session.user.username" />" name="toChangeUsernameHidden"/>


        <div class="label">
            Email:<span id="validtoChangeEmail"></span>
            <input type="text" value="<s:property value="#session.user.email" />" class="toChangeEmail"/>

        </div>
        <input type="hidden" value="<s:property value="#session.user.email" />" name="toChangeEmailHidden"/>


        <p id="toChangePassword">Change password</p>
        <input type="hidden" name="isNormalOthers" value="false"/>

        <div id="savingProfile">
            <input type="button" value="Save" id="saveNewProfile"/>
            <input type="button" value="Cancel" id="cancelProfile"/>
        </div>
    </div>

    <div id="changingPassword">

        <div class="label">
            Old Password:
            <input type="password" name="changeOldPassword" id="changeOldPassword" value=""/>
            <span id="validOldPassword1"></span>
        </div>
        <div class="label">
            New password:
            <input type="password" name="createNewPassword" id="createNewPassword" value=""/>
            <span id="validNewPassword"></span>
        </div>

        <div class="label">
            Confirm New password:
            <input type="password" name="confirmNewPassword" id="confirmNewPassword" value=""/>
            <span id="validCnfPassword1"></span>
        </div>
        <p id="toChangeOthers">Change Username and Email</p>
        <input type="hidden" name="isNormalPassword" value="false"/>

        <div id="savingPassword">
            <input type="button" value="Save" id="saveNewPassword"/>
            <input type="button" value="Cancel" id="cancelPassword"/>
        </div>
    </div>

</div>

<div id="adminContext">

    <div id="allUsers">
        <ul id="ulUsers">
            <li class="user">
                <img src="<%=request.getContextPath()%>/images/users/user2.png" width="16" height="16"
                     id="allNetworks"/><s:text name="label.user"/>
            </li>
            <ul class="subUser">
            </ul>
        </ul>
        <input type="hidden" name="selectedDevice"/>
    </div>

    <div id="deviceInfo">
    </div>

</div>

